<!DOCTYPE html>
<html>
{{template "bodyHead" "<link rel=\"stylesheet\" type=\"text/css\" href=\"/css/adminHome.css?v=1.0\"/>"}}
<body>

{{template "inc_header" .}}

<div id="main">
    <div id="main-inner">

    {{template "adminMainInfo" .}}

    {{template "adminMainNav" "posts"}}

        <div id="admin-posts-main" class="clouds">
            <h3 class="clouds-title" id="admin-page-title">文章管理</h3>
            <div class="admin-posts-main">

                <div id="admin-posts-lists">
                    <h4 class="text-center">文章列表</h4>
                    <p>
                        <span class="input-text-border">所属分类:<select name="type" id="form-postTypeSearch-option"
                                                                     title=""><option
                                value="">全部</option></select> </span>
                        <span class="input-text-border">关键字词:<input type="text" id="form-keyWorld-option" value=""
                                                                    placeholder=""></span>
                        <span class="input-text-border">每页条数:<select name="pageSize" id="form-pageSize-option" title=""><option
                                value="20">20条</option><option value="50">50条</option><option value="100">100条</option></select> </span>
                        <input type="button" id="form-content-search" value="文章查询">
                        <a href="javascript:void(0);" class="float-right" id="showAddPostForm">文章添加</a>
                    </p>
                    <table cellpadding="0" cellspacing="0" border="0">
                        <thead>
                        <tr>
                            <th>ID</th>
                            <th>分类</th>
                            <th>标题</th>
                            <th>阅读</th>
                            <th>私有</th>
                            <th>显示</th>
                            <th>评论</th>
                            <th>草稿</th>
                            <th>标星</th>
                            <th>添加</th>
                            <th>修改</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                    <div id="pager"></div>
                </div>

                <div id="admin-posts-add-form">
                    <h4 class="text-center">文章添加/编辑</h4>
                    <input type="hidden" id="form-id" value=""/>
                    <p>
                        <span class="input-text-border">所属分类:
                            <select id="form-postType" title=""><option value="">全部</option></select>
                        </span>
                        <span class="input-text-border">文章标题:
                            <input type="text" value="" id="form-title" placeholder="标题" alt="">
                        </span>
                    </p>

                    <p>
                        <span class="input-text-border">文章标签:
                            <input type="text" value="" id="form-tags" placeholder="标签" alt="">
                        </span>
                        <small>逗号或空格分隔多个</small>
                    </p>
                    <p>
                        <span class="input-text-border">添加时间:
                            <input type="text" value="" id="form-addTime" placeholder="2017-08-08 11:58:00" alt="">
                        </span>
                        <small>不填则自动带入</small>
                    </p>
                    <p>
                        评论：<label><input name="isRemark" type="radio" class="form-isRemark" value="1">允许</label>
                        <label><input name="isRemark" type="radio" class="form-isRemark" value="0">拒绝</label>
                    </p>
                    <p>
                        显示：<label><input name="isShow" type="radio" class="form-isShow" value="1">是</label>
                        <label><input name="isShow" type="radio" class="form-isShow" value="0">否</label>
                    </p>
                    <p>
                        标星：<label><input name="isStar" type="radio" class="form-isStar" value="1">是</label>
                        <label><input name="isStar" type="radio" class="form-isStar" value="0">否</label>
                    </p>
                    <p>
                        草稿：<label><input name="isTemp" type="radio" class="form-isTemp" value="0">否</label>
                        <label><input name="isTemp" type="radio" class="form-isTemp" value="1">是</label>
                    </p>
                    <p>
                        私有：<label><input name="isPrivate" type="radio" class="form-isPrivate" value="0">否</label>
                        <label><input name="isPrivate" type="radio" class="form-isPrivate" value="1">是</label>
                    </p>
                    <p>
                        <textarea name="content" style="width:100%;height:400px;visibility:hidden;"
                                  placeholder="文章内容"></textarea>
                    </p>
                    <p>
                        <input type="button" value="添加/修改" id="form-submit">
                    </p>
                </div>

            </div>
        </div>

    </div>
</div>

{{template "inc_footer" .}}

<link rel="stylesheet" href="/editor/themes/default/default.css"/>
<script charset="utf-8" src="/editor/kindeditor-min.js"></script>
<script charset="utf-8" src="/editor/lang/zh_CN.js"></script>
<script type="application/javascript" src="/js/jquery.pagination.js"></script>
<script>
    var editor;
    KindEditor.ready(function (K) {
        editor = K.create('#admin-posts-add-form textarea[name="content"]', {
            resizeType: 1,
            allowPreviewEmoticons: false,
            allowImageUpload: false,
            items: [
                'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
                'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
                'insertunorderedlist', '|', 'emoticons', 'image', 'link', 'source'],
            autoHeightMode: true,
            afterCreate: function () {
                this.loadPlugin('autoheight');
            },
            width: "100%",
            height: "300px",
        });
    });

    /**
     * 显示文章列表
     * @param page
     * @param post_type
     * @param keyWord
     */
    function showPostList(page, post_type, keyWord, pageSize) {
        $.ajax({
            url: "/admin/posts/list?page=" + page + "&keyWord=" + keyWord + "&type=" + post_type + "&pageSize=" + pageSize,
            method: "GET",
            dataType: "json",
            success: function (d) {
                $('#admin-posts-lists table tbody tr').remove();
                if (d.error != 0 || !d.data || !d.data.lists) {
                    $('#admin-posts-lists table tbody').append("<tr><td colspan='12' class='text-center'>暂无内容</td></tr>");
                    return;
                }

                for (var i in d.data.lists) {
                    var $pager = $('<tr></tr>');
                    $pager.append("<td class='text-center'><b class='post-form-id'>" + d.data.lists[i].id + "</b></td>");
                    $pager.append("<td >" + d.data.lists[i].post_type_info + "</td>");
                    $pager.append("<td><a href='/read/" + d.data.lists[i].id + "' title='" + d.data.lists[i].title + "' target='_blank'>" + d.data.lists[i].title + "</a></td>");
                    //cons = removeHTMLTag(d.data.lists[i].content);
                    //$pager.append("<td class='post-contents' width='30%' title='"+cons+"'>"+cons.substr(0,40)+"</td>");
                    $pager.append("<td class='text-center'>" + d.data.lists[i].read_num + "</td>");
                    if (d.data.lists[i].is_private) {
                        $pager.append("<td class='text-center'>✔</td>");
                    } else {
                        $pager.append("<td class='text-center'>&nbsp;</td>");
                    }
                    if (d.data.lists[i].is_show) {
                        $pager.append("<td class='text-center'>✔</td>");
                    } else {
                        $pager.append("<td class='text-center'>&nbsp;</td>");
                    }
                    if (d.data.lists[i].is_remark) {
                        $pager.append("<td class='text-center'>✔</td>");
                    } else {
                        $pager.append("<td class='text-center'>&nbsp;</td>");
                    }
                    if (d.data.lists[i].is_temp) {
                        $pager.append("<td class='text-center'>✔</td>");
                    } else {
                        $pager.append("<td class='text-center'>&nbsp;</td>");
                    }
                    if (d.data.lists[i].is_star) {
                        $pager.append("<td class='text-center'>✔</td>");
                    } else {
                        $pager.append("<td class='text-center'>&nbsp;</td>");
                    }
                    $pager.append("<td class='text-center'>" + d.data.lists[i].add_time + "</td>");
                    $pager.append("<td class='text-center'>" + d.data.lists[i].last_edit_time + "</td>");
                    $pager.append("<td class='text-center'><a href='javascript:void(0);' class='form-post-edit-link' title='修改'>✐</a> &nbsp; <a href='' title='关闭'>✖</a></td>");
                    $('#admin-posts-lists table tbody').append($pager);
                }
                $("#pager").pager({
                    pagenumber: d.data.current_page,
                    pagecount: d.data.page_num,
                    buttonClickCallback: function (destPage) {
                        showPostList(
                                destPage,
                                $('#form-postTypeSearch-option option:selected').val(),
                                $('#form-keyWorld-option').val(),
                                $('#form-pageSize-option option:selected').val(),
                        );
                    }
                });
            }
        });
    }

    /**
     * 获取所有分类
     */
    function showPostTypeSelect() {
        $.ajax({
            url: "/admin/types/all",
            method: "GET",
            dataType: "json",
            success: function (d) {
                if (d.data.length < 1) {
                    alert("数据获取失败");
                    return;
                }
                str_search = str_insert = "";
                for (var i in d.data) {
                    str_search += "<option value='" + (d.data[i].id) + "'>" + (d.data[i].name) + ":" + (d.data[i].id) + "</option>";
                    if (d.data[i].child && d.data[i].child.length >= 1) {
                        for (var m in d.data[i].child) {
                            str_search += "<option value='" + (d.data[i].child[m].id) + "'>&nbsp;&nbsp;&nbsp;&nbsp;" + (d.data[i].child[m].name) + ":" + (d.data[i].child[m].id) + "</option>";
                            str_insert += "<option value='" + (d.data[i].child[m].id) + "'>" + (d.data[i].name) + "--" + (d.data[i].child[m].name) + "</option>"
                        }
                    }
                }
                $('#form-postTypeSearch-option').html(str_search);
                $('#form-postType').html(str_insert);
            }
        });
    }

    //重置添加文章的表单
    function resetAddPostForm(data) {
        console.log(data);
        form = $('#admin-posts-add-form');
        data.id && form.find('#form-id').val(data.id);
        data.post_type && form.find('#form-postType').find("option[value=" + data.post_type + "]").attr("selected", true);
        data.title && form.find('#form-title').val(data.title);
        console.log("data.is_private:"+data.is_private)
        if (data.is_private == 1) {
            form.find(".form-isPrivate[value=1]").attr("checked", true);
        } else {
            form.find(".form-isPrivate[value=0]").attr("checked", true);
        }
        if (data.is_show == 0) {
            form.find(".form-isShow[value=0]").attr("checked", true);
        } else {
            form.find(".form-isShow[value=1]").attr("checked", true);
        }
        if (data.is_remark == 0) {
            form.find(".form-isRemark[value=0]").attr("checked", true);
        } else {
            form.find(".form-isRemark[value=0]").attr("checked", true);
        }
        console.log("data.is_temp:"+data.is_temp)
        if (data.is_temp == 1) {
            form.find(".form-isTemp[value=1]").attr("checked", true);
        } else {
            form.find(".form-isTemp[value=0]").attr("checked", true);
        }
        if (data.is_star == 1) {
            form.find(".form-isStar[value=1]").attr("checked", true);
        } else {
            form.find(".form-isStar[value=0]").attr("checked", true);
        }
        data.add_time && form.find('#form-addTime').val(data.add_time);
        console.log(data.tags);
        if (data.tags) {
            tagstr = "";
            for (var i = 0; i < data.tags.length; i++) {
                tagstr += (data.tags[i].name)+" ";
            }
            form.find('#form-tags').val(tagstr);
        }
        data.content && editor.html(data.content);
    }

    //获取数据
    function getPostData(type) {
        var data = new Object(), form = $('#admin-posts-add-form');
        if (type == 'edit') {
            data.id = form.find('#form-id').val();
        } else {
            data.id = 0;
        }
        data.post_type = form.find('#form-postType').val();
        data.title = form.find('#form-title').val();
        data.is_private = form.find('.form-isPrivate').val();
        data.is_show = form.find('.form-isShow').val();
        data.is_remark = form.find('.form-isRemark').val();
        data.is_temp = form.find('.form-isTemp').val();
        data.is_star = form.find('.form-isStar').val();
        data.add_time = form.find('#form-addTime').val();
        data.tags = form.find('#form-tags').val();
        data.content = editor.html();
        return data;
    }

    function postForm(postData, toUrl, func) {
        $.ajax({
            url: toUrl,
            method: "POST",
            dataType: "json",
            data: postData,
            success: function (d) {
                func(d)
            }
        });
    }

    function getPostInfo(id, func) {
        $.ajax({
            url: "/admin/posts/info/" + id,
            method: "GET",
            dataType: "json",
            success: function (d) {
                func(d)
            }
        });
    }

    $(function () {

        (function ($) {
            $.getUrlParam = function (name) {
                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
                var r = window.location.search.substr(1).match(reg);
                if (r != null)
                    return unescape(r[2]);
                return '';
            }
        })(jQuery);


        showPostList($.getUrlParam('page'), $.getUrlParam('type'), $.getUrlParam('keyWord'), $.getUrlParam('pageSize'));
        showPostTypeSelect();

        //添加文章
        $('#showAddPostForm').on('click', function () {
            resetAddPostForm(null);
            $('#admin-posts-add-form').show();
            //点击添加按钮
            $("#form-submit").on('click', function () {
                data = getPostData('add');
                postForm(data, "/admin/posts/add", function (d) {
                    console(d);
                })
            });
        });

        //文章编辑修改
        $('#admin-posts-lists').on('click', '.form-post-edit-link', function () {
            id = $(this).parents("tr").find('.post-form-id').text();
            getPostInfo(id, function (d) {
                if (d.error != 0 || !d.data) {
                    return;
                }
                resetAddPostForm(d.data);
                $('#admin-posts-add-form').show();
            });
        });

        //文章查询
        $('#form-content-search').on('click', function () {
            showPostList(
                    1,
                    $('#form-postTypeSearch-option option:selected').val(),
                    $('#form-keyWorld-option').val(),
                    $('#form-pageSize-option option:selected').val(),
            );
        })
    });
</script>
</body>
</html>